<template>
  <div>
    <a-form :form="form" @submit="handleSubmit">

    <el-tabs v-model="activeName" >
      <el-tab-pane label="工程参数设置" name="first" >
        <project-parameter ref="projectParameter" :projectParameters="this.projectParameterData"/>
      </el-tab-pane>
      <el-tab-pane label="选择表" name="two" >
        <div>
          <h1>上传pdm文件:</h1>

          <el-upload
    class="upload-file"
    ref="upload"
    :disabled="true"
    action="">
    <el-button size="small" type="primary">点击上传</el-button>
    <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
  </el-upload>
          <h1>选择表:</h1>
          <el-transfer
            filterable
            :filter-method="filterMethod"
            filter-placeholder="请输入表中文或英文"
            :titles="['未选择的表', '已选择的表']"
            v-model="selectTable"
            :data="allTable"
            style="margin-bottom: 20px;"
          >
          </el-transfer>
        </div>
      </el-tab-pane>
    </el-tabs>
    <a-button type="primary" html-type="submit">生成代码</a-button>
    <a-button type="primary" @click="loadLastProjectParameterValue()" v-if="this.showProjectParameter">获取最后工程参数</a-button>
    <a-button @click="returnList">返回</a-button>
  </a-form>
  </div>
</template>

<script>
import request from "../utils/request";
import projectParameter from "../projectparameter/parent";
import { baseUrl } from "../utils/env";
export default {
  name: "run",
  components: {
    projectParameter
  },
  data(){
    return {
      file: {},
      fileList: [],
      selectTable:[],
      allTable:[],
      id:'',
      showTabs:false,
      activeName:'first',
      showProjectParameter:false,
      showSelectTable:false,
      isDataSource:'',
      projectParameterData: [],
      form: this.$form.createForm(this, { name: 'coordinated' }),
      projectParameterValue:{},
      actionUrl:'',
    }
  },
  methods: {
    uploadFile({file, onProgress, onSuccess, beforeUpload}, row) {
      let that = this;
      this.$refs["uploadPdm"](file, progress => {
        onProgress(progress)
      }).then(res => {
        // onSuccess({
        //   name: res.name,
        //   url: res.url,
        // })
        if (res.data.status == "1") {
          debugger;
          that.allTable = res.data.list;
          // response.data.list.forEach(function(c, index) {
          //   that.allTable.push({
          //     key: c.key,
          //     label: c.label
          //   });
          // });
        }
        this.$message(res.data.message);
      })
    },
    filterMethod(query, item){
      return item.key.indexOf(query) > -1 || item.label.indexOf(query) > -1;
    },
    getFile(item) {
      console.log(item.file)
      this.file = item.file
    },
    upload() {
      const fd = new FormData()
      fd.append('filename', this.file)
      // const config = { headers: { 'Content-Type': 'multipart/form-data' }}
      // this.$request.post('/uploading', fd, config
      // ).then(response => {        this.$message.success(response.retCode)
      // })
      const  that = this;
      request({
        method: "POST",
        url: "/api/Project/uploadPdmFile",
        headers: { 'Content-Type': 'multipart/form-data' },
        data: fd
      }).then(response => {
        if (response.data.status == "1") {
          debugger;
          that.allTable = response.data.list;
          // response.data.list.forEach(function(c, index) {
          //   that.allTable.push({
          //     key: c.key,
          //     label: c.label
          //   });
          // });
        }
        this.$message(response.data.message);
      })
    },
    handleSubmit(e) {
      e.preventDefault();
      this.form.validateFields((err, values) => {
        debugger;
        console.log(this.$refs["projectParameter"].data);
        //没有错误
        if (err==null) {
          console.log('no error: ', values);
          this.projectParameterValue = this.$refs["projectParameter"].data;
          this.makeCode();
        }
      });
    },
    //生成代码
    makeCode(){
      var tableCode=[];
      //循环选择表放到数组
      if(this.isDataSource=="1") {
        if (this.selectTable.length == 0) {
          this.$message("请选择表!");
          return;
        }
        debugger;
        for (var i = 0; i < this.selectTable.length; i++) {
          tableCode.push(this.selectTable[i]);
        }
      }
      this.$confirm("是否生成代码?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      }).then(() => {
        request({
          method: "POST",
          data:this.projectParameterValue,
          url: "/api/Project/run?projectId="+this.id+"&tableCode="+tableCode
        })
          .then(res => {
            if (res.data.status == "1") {

              this.$message(res.data.message);
            } else {
              this.$message(res.data.message);
              return false;
            }
          })
          .catch(err => {
            console.log(err);
          });
      })
        .catch(err => {
          console.log(err);
        });
    },
    returnList(){
      this.$router.push({path: "/project/list"});
    },
    //装入表格数据
    loadProjectParameterData(projectId) {
      const that = this;
      request({
        method: "GET",
        url: `/api/ProjectParameter/listControlProperitesByProjectId?projectId=${projectId}`,
      })
        .then(res => {
          if (res.data.status == "1") {
            debugger;
            that.projectParameterData = res.data.list;
            console.log("projectParameterData:"+JSON.stringify(that.projectParameterData));
            if(res.data.count>0){
              that.showProjectParameter = true;
            }else{
              that.showProjectParameter = false;
            }
            if(that.showProjectParameter||that.showSelectTable){
              that.showTabs = true;
            }else{
              that.showTabs = false;
            }
            that.activieTab();
          } else {
            that.showProjectParameter = false;
            if(that.showProjectParameter||that.showSelectTable){
              that.showTabs = true;
            }else{
              that.showTabs = false;
            }
            that.activieTab();
            this.$message(res.data.message);
            return false;
          }

        })
        .catch(err => {
          console.log(err);
        });
    },
    //获取当前用户最后工程参数
    loadLastProjectParameterValue() {
      const that = this;
      var userId = localStorage.userId;
      var projectId = this.id;
      request({
        method: "GET",
        url: `/api/ProjectParameter/getLastProjectParameterByProjectId?projectId=${projectId}&runUserId=${userId}`,
      })
        .then(res => {
          if (res.data.status == "1") {
            debugger;
            that.projectParameterValue = res.data.bean;
            console.log("projectParameterValue:"+JSON.stringify(that.projectParameterValue));
            //更新工程参数值
            this.$refs["projectParameter"].setPropertiesValue(that.projectParameterValue);
          } else {
            this.$message(res.data.message);
            return false;
          }

        })
        .catch(err => {
          console.log(err);
        });
    },
    activieTab(){
      if(this.showProjectParameter){
        this.activeName="first";
      }else{
        this.activeName="two";
      }
    },
    getLastProject(){

    }
  },

  mounted() {
    this.id = this.$route.params.id;
    this.isDataSource = this.$route.params.isDataSource;
    console.log("isDataSource:"+this.isDataSource);
    if(this.isDataSource=="1"){
      this.showSelectTable = true;
      // this.showTabs =true;
    }else{
      this.showSelectTable = false;
    }
    this.loadProjectParameterData(this.id);
    this.actionUrl = baseUrl+"/api/Project/uploadPdmFile";
  }

}
</script>

<style scoped>

</style>
